@charset "UTF-8";
body, p, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, fieldset, legend, input, select, textarea, button, th, td, menu {
  margin: 0;
  padding: 0; }

* {
  box-sizing: border-box; }

ul, dl, ol {
  list-style: none; }

img, fieldset, input[type="submit"] {
  border: 0 none; }

em {
  font-style: normal; }

strong {
  font-weight: normal; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

button, input[type="button"] {
  cursor: pointer;
  border: 0 none; }

a, button, input, img {
  -webkit-touch-callout: none; }

img {
  /*pointer-events:none;*/
  /*禁止图片的点击事件，例如长按保存图片*/ }

input, select, textarea {
  outline: none; }

a {
  text-decoration: none; }

html, body {
  /*禁止用户选择元素*/
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -khtml-user-select: none;
  /*禁止元素点击出现半透明黑色背景*/
  -webkit-tap-highlight-color: transparent; }

html {
  height: 100%;
  width: 100%;
  font-family: 'Microsoft YaHei','Heiti SC';
  outline: 0;
  -webkit-text-size-adjust: none; }

body {
  height: 100%;
  margin: 0;
  position: relative; }

/*浮动，与清除浮动*/
.fl {
  float: left; }

.fr {
  float: right; }

.clear {
  clear: both; }

.clearfix:after {
  content: "";
  display: block;
  clear: both; }

body {
  position: relative; }

.wrap {
  width: 100%;
  height: 100%; }

.wrap img {
  width: 100%;
  height: 100%; }

.wrap .center {
  left: 0;
  right: 0;
  margin: 0 auto; }

#page_result {
  position: absolute;
  top: 0;
  left: 400%;
  width: 100%;
  height: 100%;
  background: url(../img/result/result_bg2.jpg) no-repeat center;
  background-size: 100% 100%;
  color: #251d19;
  font-weight: 600; }

#page_result .result_name {
  position: absolute;
  top: 0.4rem;
  left: 0.375rem;
  width: 7.375rem;
  height: 2.7rem;
  -webkit-animation: bounceInLeft 1s linear;
  animation: bounceInLeft 1s linear; }

#page_result .result_name .name_bg {
  position: relative;
  width: 100%;
  height: 100%;
  background: url(../img/result/name.png) no-repeat center;
  background-size: 100% 100%; }

#page_result .result_name .portrait {
  position: absolute;
  left: 0.625rem;
  top: 0.55rem;
  width: 1.55rem;
  height: 1.55rem;
  z-index: 2; }

#page_result .result_name .name {
  position: absolute;
  right: 2rem;
  top: 0.9rem;
  font-size: 0.6rem;
  color: #251d19;
  text-align: center; }

#page_result .logo {
  background: url(../img/index/logo.png) no-repeat center;
  background-size: cover;
  position: absolute;
  right: 0.5rem;
  top: 0.45rem;
  width: 6.425rem;
  height: 1.875rem;
  -webkit-animation: bounceInRight 1s linear;
  animation: bounceInRight 1s linear; }

#page_result .result_medal {
  position: absolute;
  top: 2.85rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 5.775rem;
  height: 6.725rem;
  -webkit-animation: fadeIn 4s linear;
  animation: fadeIn 4s linear;
  animation: fadeIn 4s linear; }

#page_result .result_sum {
  position: absolute;
  top: 9.525rem;
  width: 8.55rem;
  height: 2.575rem;
  font-size: 1.3rem;
  color: #251d19;
  line-height: 2.7rem;
  text-align: center;
  padding-right: 0.6rem;
  background: url(../img/result/result.png) no-repeat center;
  background-size: 100% 100%;
  -webkit-animation: bounceInDown 2s linear;
  animation: bounceInDown 2s linear; }

#page_result .result_text {
  position: absolute;
  top: 12.325rem;
  width: 17.75rem;
  height: 5rem;
  font-size: 0.8rem;
  text-align: center;
  line-height: 1.5rem;
  padding: 1rem;
  background: url(../img/result/result_text.png) no-repeat center;
  background-size: 100% 100%;
  -webkit-animation: bounceInUp 3s linear;
  animation: bounceInUp 3s linear; }

#page_result .result_nextbtn {
  position: absolute;
  left: 0.975rem;
  top: 17.725rem;
  width: 7.625rem;
  height: 2.85rem;
  font-size: 0.875rem;
  text-align: center;
  line-height: 2.35rem;
  padding-left: 1rem;
  background: url(../img/result/btn_left.png) no-repeat center;
  background-size: 100% 100%;
  -webkit-animation: bounceInLeft 4s linear;
  animation: bounceInLeft 4s linear; }

#page_result .result_sharebtn {
  position: absolute;
  left: 9.55rem;
  top: 17.65rem;
  width: 8.675rem;
  height: 2.8rem;
  font-size: 0.875rem;
  text-align: center;
  line-height: 2.4rem;
  padding-right: 1.75rem;
  background: url(../img/result/btn_right.png) no-repeat center;
  background-size: 100% 100%;
  -webkit-animation: bounceInRight 4s linear;
  animation: bounceInRight 4s linear; }

#page_result .result_rank_title {
  position: absolute;
  bottom: 6.375rem;
  width: 10.45rem;
  height: 2.975rem;
  z-index: 4; }

#page_result .result_rank {
  position: absolute;
  bottom: 0.5rem;
  width: 17.125rem;
  height: 7.05rem;
  background: url(../img/result/rank.png) no-repeat center;
  background-size: 100% 100%;
  -webkit-animation: bounceIn 4s linear;
  animation: bounceIn 4s linear; }

#page_result .result_rank ul {
  padding: 1rem; }

#page_result .result_rank li {
  margin-bottom: 0.375rem; }

#page_result .result_rank li > div {
  white-space: nowrap; }

#page_result .result_rank .rank_name, #page_result .result_rank .rank_num, #page_result .result_rank .rank_gad {
  font-size: 0.6rem; }

#page_result .result_rank .rank_portrait, #page_result .result_rank .rank_medal {
  display: inline-block;
  vertical-align: middle; }

#page_result .result_rank .rank_portrait {
  width: 1.3rem;
  height: 1.35rem;
  margin-left: 0.2rem; }

#page_result .result_rank .rank_medal {
  width: 1.175rem;
  height: 1.35rem;
  margin-right: 0.25rem;
  margin-left: 0.125rem; }
